<style>

    .flex{
        display: flex;
        margin-left: 50px;
        margin-bottom: 10px;
        align-items: center;
    }
    .avatars{
        width: 50px;
        border-radius: 50%;
        height: 50px;
    }

    .nicknames{
        color: #999;
    }
    .nicknames:nth-child(2){
        line-height: 10px;
    }
    .flexs{
        display: flex;
    }
    .bar{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-right: 10px;
    }
    .listWrap{
        display: flex;
        align-items: center;
    }
    .titleBar{
        margin-left: 15px;
    }

    .aaaa{
        display: flex;
        flex-direction: column;
    }

    .hr1{
        height:50px;
        width:2px;
        background-color:#d9d9d9;
        margin-left:25px;
    }
    .titles{
        font-size: 15px;
    }

    .color1{
        color: #f59a23;
    }
    .color2{
        color: #67C23A;
    }
    .color3{
        color: #F56C6C;
    }
</style>
<form id="edit-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div class="panel-heading">
        <h3>{$name}<span id="status_name" style="color: red"></span></h3>
    </div>

    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('审批编号')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="c-code" class="form-control" readonly="readonly" type="text" value="{$row.code|htmlentities}">
        </div>
    </div>

    {foreach $detail as $index=>$vo}
    <div id="wuping" class="form-group">
        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2"><h4>报销明细({$index+1})</h4></label>
            <div class="col-xs-12 col-sm-8">
                <!--<input id="c-1" class="form-control" data-rule="required" name="row[purpose]" type="text" value="">-->
            </div>
        </div>

        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">{:__('报销金额(元)')}:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="c-money" class="form-control money" readonly="readonly" type="text" value="{$vo.money}">
            </div>
        </div>

        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">{:__('报销类别')}:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="c-type" class="form-control" readonly="readonly" type="text" value="{$vo.type}">
            </div>
        </div>

        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">{:__('费用明细')}:</label>
            <div class="col-xs-12 col-sm-8">
                <textarea rows="10" disabled cols="67">{$vo.cost}</textarea>
            </div>
        </div>


    </div>
    {/foreach}

    <div class="form-group">
        <label for="c-img" class="control-label col-xs-12 col-sm-2">{:__('图片')}:</label>
        <div class="col-xs-12 col-sm-8">
            <!--<div class="input-group">-->
            <input id="c-img"  data-rule="" class="form-control" readonly="readonly" type="text" value="{$row.images|htmlentities}">
            <!--</div>-->
            {if condition="$row.images != '' "}
            <ul class="row list-inline plupload-preview" id="p-img">
                {foreach $row.image as $index=>$vo}
                <li class="col-xs-3">
                    <a href="{$vo}" data-url="{$vo}" target="_blank" class="thumbnail">
                        <img src="{$vo}" onerror="this.src='/QjaGeuOTbZ.php/ajax/icon?suffix=jpg';this.onerror=null;" class="img-responsive">
                    </a>
                </li>
                {/foreach}
            </ul>
            {/if}
        </div>
    </div>

    <div class="form-group" id="comment">
        <div class="form-group">
            <label for="status" class="control-label col-xs-12 col-sm-2">{:__('审核状态')}:</label>
            <div class="col-xs-12 col-sm-8">
                <select id="status" class="form-control selectpicker" name="row[status]">
                    <option data-type="type" value="1">审核通过</option>
                    <option data-type="type" value="2">审核驳回</option>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="status" class="control-label col-xs-12 col-sm-2">{:__('备注')}:</label>
            <div class="col-xs-12 col-sm-8">
                <input id="msg" class="form-control" type="text" value="">
            </div>
            <a href="javascript:;" name="users" class="btn btn-success" >{:__('审核')}</a>
        </div>
    </div>

    <div  class="form-group">
        <div class="flex" style="border-top: 1px solid #93a1a1; padding-top: 10px; margin-right: 20px;box-sizing: border-box">
            <!--<h3 class="title" style="color: red;padding-left:20px">评论:</h3>-->
        </div>

        <div class="form-group">
            <label class="control-label col-xs-12 col-sm-2">{:__('抄送人')}:</label>
            <div class="col-xs-12 col-sm-8 flexs">
                {foreach $pan_arr as $index=>$vo}
                <div class="bar">
                    <img class="avatars" src="{$vo.avatar}">
                    <h4 class="title nickname">{$vo.nickname}</h4>
                </div>
                {/foreach}
            </div>
        </div>

        <div style="width: 100%;">
            <label class="control-label col-xs-12 col-sm-2">审批人：</label>
            <div class="col-xs-12 col-sm-8 aaaa">

            </div>

        </div>


    </div>

    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="reset" class="btn btn-primary btn-embossed btn-close" onclick="Layer.closeAll();">{:__('Close')}</button>
        </div>
    </div>
</form>
<script src="/assets/img/jquery-3.4.1.min.js"></script>
<script>
    var type = {$type};
    var iss = {$iss};

    //console.log(type);

    if(type == 2) {
        if(iss == 0) {
            $('#comment').show();
        }else{
            $('#comment').hide();
        }
    }else{
        $('#comment').hide();
    }




    $("a[name='users']").click(function(){
        let status =  $("#status").val();
        let msg =  $("#msg").val();
        let id =  {$row.id};
        //console.log(type);

        $.ajax({
            url:"oa/goods/for",    //请求的url地址
            dataType:"json",   //返回格式为json
            async:true,//请求是否异步，默认为异步，这也是ajax重要特性
            data:{"msg":msg,"status":status,"id":id,"type":6},    //参数值
            type:"POST",   //请求方式
            success:function(data){
                //请求成功时处理
                if (data.code == 0) {
                    //console.log(data);
                    Toastr.error(data.msg);
                }else {
                    Toastr.success(data.msg);
                    parent.$(".btn-refresh").trigger("click");
                    $('#comment').hide();
                    getList('oa/apply/get_comment');

                    //parent.Layer.closeAll();
                    //$("#nickname").attr("value",data.data);
                }
            },
        });

    });

     getList('get_comment');
    function getList(url){
        let id =  {$row.id};
        let ids =  '{$row.ids}';
        let admin_id =  {$row.admin_id};
        let create_time =  {$row.create_time};

        $.ajax({
            url:url,    //请求的url地址
            dataType:"json",   //返回格式为json
            async:true,//请求是否异步，默认为异步，这也是ajax重要特性
            data:{"id":id,"ids":ids,"admin_id":admin_id,"create_time":create_time},    //参数值
            type:"POST",   //请求方式
            success:function(data){
                //console.log(data)
                //请求成功时处理
                if (data.code == 0) {
                    //console.log(data);
                    Toastr.error(data.msg);
                }else {
                    $('.aaaa').empty()
                    data.data.forEach((item,index)=>{
                        //console.log(index)
                        //console.log(item)
                        let html_status;
                        let html_hr;
                        if(item.statuss==1){
                            html_status = `<div class="titles color1">${item.status}</div>`
                        }else if(item.statuss==2){
                            html_status = `<div class="titles color2">${item.status}</div>`
                        }else if(item.statuss==3){
                            html_status = `<div class="titles color3">${item.status}</div>`
                        }else{
                            html_status = `<div class="titles">${item.status}</div>`
                        }

                        if(index < data.data.length-1){
                            html_hr = `<div class="hr1"></div>`
                        }else {
                            html_hr = '';
                        }


                        let html = `<div class="listWrap">
                        <img class="avatars" src="${item.avatar}">
                        <div class="titleBar">
                            <div class="titles nicknames">${item.nickname}</div>
                            <div class="titles nicknames">${item.create_time}</div>
                            ${html_status}
                        </div>
                    </div>
                    <div class="listWrap titles">${item.msg}</div>
                    ${html_hr}
                    `
                        $('#status_name').html(data.msg)
                        $('.aaaa').append(html)
                    })


                }
            },
        });
    }


</script>
